<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Restaurant Home Page</title>
        <meta name="description" content="Handbag" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
        <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
        <link rel="stylesheet" href="css/layout.css" type="text/css"/>
        <link rel="stylesheet" href="css/ws_container.css" type="text/css"/>
        <link rel="stylesheet" href="css/ws_contact.css" type="text/css"/>
    </head>

    <!-- HOT LINE -->
    <link rel="stylesheet" href="../../widget/hotline/0/hotline_0.css" type="text/css"/>
    <!-- LOGO -->
    <link rel="stylesheet" href="../../widget/logo/3/logo_3.css" type="text/css" />
    <!-- SEARCH -->
    <link rel="stylesheet" href="../../widget/search_bar/3/search_bar_3.css" type="text/css" />
    <!-- HMENU -->
    <link rel="stylesheet" href="../../widget/hmenu/4/hmenu_4.css" type="text/css" />
    <!-- BREADCRUMBS -->
    <link rel="stylesheet" href="../../widget/breadcrumbs/1/breadcrumbs_1.css" type="text/css" />
    <!-- HTML BLOCK 1 -->
    <link rel="stylesheet" href="../../widget/html_block/1/html_1.css" type="text/css" />
    <!-- TEXT LIST 1 -->
    <link rel="stylesheet" href="../../widget/text_list/1/text_list_1.css" type="text/css" />
    <!-- Social 8 -->
    <link rel="stylesheet" href="../../widget/social_network/8/social_8.css" type="text/css" />
    <!-- HTML BLOCK 8 -->
    <link rel="stylesheet" href="../../widget/html_block/8/html_8.css" type="text/css" />
    <!-- HTML BLOCK 9 -->
    <link rel="stylesheet" href="../../widget/html_block/9/html_9.css" type="text/css" />
    <!-- HTML BLOCK 20 -->
    <link rel="stylesheet" href="../../widget/html_block/20/html_20.css" type="text/css" />
    <!-- HTML BLOCK 21 -->
    <link rel="stylesheet" href="../../widget/html_block/21/html_21.css" type="text/css" />
    <!-- CONTACT FORM 10 -->
    <link rel="stylesheet" href="../../widget/contact/10/contact_10.css" type="text/css" />

    <body>
        <div id="wrapper">	
            <div id="wrapper_top">
                <div id="wrapper_header_1">
                    <div id="hook_header" class="hook">
                        <!-- hook header : widget : hotline, logo, search bar -->

                        <!-- HOTLINE WIDGET -->

                        <div id="hotline_wi" class="hotline_0">
                            <img src="images/hotline_logo.png" alt="hotline_logo" class="hl_align_left"/>
                            <div class="hl_infor">
                                <div class="hl_content">
                                    Call us for reservation
                                </div><!-- End .hl_conent -->
                                <div class="hl_phone_number">
                                    (84)851236536
                                </div><!-- End .hl_phone_number -->
                            </div><!-- End .hl_infor -->
                        </div><!-- End .hotline_0 -->
                        <!-- End HOTLINE WIDGET -->

                        <!-- LOGO WIDGET -->
                        <div id="logo_wi" class="logo_3">

                            <div class="logo_content_wrapper">
                                <div class="logo_content">
                                    <h1 class="company_name">Tiara</h1>
                                    <h3 class="company_description">Restaurant</h3>
                                </div><!-- End .logo_content -->
                            </div><!-- End .logo_content_wrapper -->
                        </div>
                        <!-- End LOGO WIDGET -->

                        <!-- SEARCH BAR WIDGET -->
                        <div id="search_bar_wi" class="search_bar_3">
                            <form class="searchForm" method="post" action="#">
                                <div class="search_bar_wrapper">
                                    <input class="search_text" type="text" name="txtsearch" value="Search keyword here"/>
                                    <input class="search_submit" type="submit" name="btnsearch" value=">"/>
                                </div><!-- End #search_bar_wrapper -->
                            </form>
                        </div><!-- End .search_bar_3 -->
                        <!-- End SEARCH BAR WIDGET -->
                        <style>


                        </style>
                        <!-- HMENU WIDGET -->
                        <div id="hemnu_wi" class="hemnu_4">
                            <div class="hmenu_wrapper">
                                <div class="hemnu_bullet_left"></div>
                                <ul class="hmenu_items">
                                    <li><a href="#">Home</a></li>
                                    <li><a href="#">About us</a></li>
                                    <li><a href="#">Gallery</a></li>
                                    <li class="current"><a href="#">Contact</a></li>
                                    <li><a href="#">Blog</a></li>
                                    <li class="last_item"><a href="#">News</a></li>
                                </ul>
                                <div class="hemnu_bullet_right"></div>
                            </div><!--End hmenu_wrapper-->
                        </div>
                        <!-- End HEMNU WIDGET -->

                    </div><!-- End hook_header -->
                </div><!-- End #wrapper_header_1 -->
            </div>
            <!-- End wrapper_top -->

            <!--- Wrapper MAIN --->

            <div id="wrapper_main">
                <div id="hook_breadcrumbs" class="hook">
                    <div id="wrapper_breadcrumbs">
                        <ul>
                            <li>
                                <a href="#">Trang chủ</a>
                            </li>

                            <li class="current">
                                <a href="#">Contact</a>
                            </li>
                        </ul>
                    </div><!-- #wrapper_breadcrumbs -->
                </div>

                <div id="wrapper_custom_6">
                    <div id="hook_google_map" class="hook">
                        <div id="wi_google_map" class="google_map_1">
                            <link rel="stylesheet" href="../../widget/google_map/1/google_map_1.css" type="text/css" />
                            <h1 class="title">Contact Information</h1>
                            <div class="wrapper_map">
                                <img src="images/google_map.png" alt=""/>
                            </div>
                            <p class="note">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
                                laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore.</p>

                            <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque la
                                udantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam 
                                voluptatem quia voluptas.</p>

                            <div class="clear"></div>

                        </div>
                    </div>
                    <!-- End .google_map_1 -->


                    <div id="hook_contact_infor" class="hook">

                        <div id="html_20" class="html_20">

                            <img src="images/letter.png" />
                            <div class="html_content">
                                <p class="company_name">The Company Name Inc.</p>
                                <p class="company_address">9870 St Vincent Place, Glasgow, DC 45 Fr 45</p>
                            </div>
                            <!-- End .html_content -->
                            <div class="clear"></div>
                        </div>
                        <!-- End .html_20 -->

                        <div id="html_21" class="html_21">

                            <img src="images/address.png" />
                            <div class="html_content">
                                <p class="Telephone">Telephone : <span>+1 800 603 6035</span></p>
                                <p class="FAX">FAX : <span>+1 800 603 6035</span></p>
                                <p class="email">Email : <span>mail@demolink.org</span></p>
                            </div>
                            <!-- End .html_content -->
                            <div class="clear"></div>
                        </div>
                        <!-- End .html_21 -->

                    </div><!-- End #hook_contact_infor -->
                </div>
                <style>
                    #wrapper_custom_7 {
                        width: 490px;
                        float: right;

                    }
                </style>

                <div id="wrapper_custom_7">
                    <div id="hook_contact_form">
                  
                        <div id="contact_form_wi" class="contact_form_10">
                            <form id="contact_form" class="contact_form" method="post" action="#" >
                                <h1 class="title">Contact Form</h1>
                                <div class="input">
                                    <label for="name">Enter your name :</label>
                                    <input type="text" name="name" id="name" class="name"/>
                                    <div class="clear"></div>
                                </div>

                                <div class="input text_error">
                                    <label for="phone">Enter your phone :</label>
                                    <input type="text" name="phone" id="phone" class="phone"/>
                                    <div class="clear"></div>
                                </div>

                                <div class="input">
                                    <label for="email">Enter your email :</label>
                                    <input type="text" name="email" id="email" class="email"/>
                                    <div class="clear"></div>
                                </div>  

                                <div class="input_area area_error">
                                    <label for="content">Enter your message :</label>
                                    <textarea class="content" id="content" name="content" rows="11" cols="60"></textarea>
                                    <div class="clear"></div>
                                </div>  

                                <div class="button_section">
                                    <input type="submit" id="btnclear" class="btn" value="Clear"/>
                                    <input type="submit" id="btnsend" class="btn" value="Send"/>
                                </div>

                            </form>

                        </div><!-- End #contact_form_10 -->
                    </div><!-- End #hook_contact_form -->
                </div>
                <!-- End #wrapper_custom_7 -->
                <div style="clear:both"></div>
            </div>
            <!-- End #wrapper_custom_6 -->






            <div id="wrapper_footer">
                <div id="wrapper_footer_section_1">

                    <div id="hook_footer_section_1" class="hook">

                        <div id="html_8" class="html_8">
                            <h1>
                                Tiara
                            </h1>
                            <h3>Restaurant</h3>
                        </div><!-- End .html_8 -->


                        <div id="html_9" class="html_9">

                            <h1>Contact info</h1>
                            <div class="address">8901 Marmora Road, Glasgow, D04 89GR.</div>
                            <ul>
                                <li>Freephone: <span>+1 800 559 6580</span></li>
                                <li>Telephone: <span>+1 800 603 6035</span></li>
                                <li>FAX: <span>+1 800 889 9898</span></li>
                                <li>E-mail: </span>mail@demolink.org</span></li>
                            </ul>


                        </div>
                        <!-- End .html_9 -->

                        <div id="social_8" class="social_8">

                            <h1>Keep in touch</h1>   
                            <ul>
                                <li>
                                    <img src="images/facebook.png" alt="facebook" /> 
                                    <a href="#">Facebook</a>
                                    <div style="clear: both;"></div>
                                </li>

                                <li class="right">
                                    <img src="images/google_plus.png" alt="google_plus" /> 
                                    <a href="#">Google Plus</a>
                                    <div style="clear: both;"></div>
                                </li>

                                <li>
                                    <img src="images/twitter.png" alt="twitter" /> 
                                    <a href="#">Twitter</a>
                                    <div style="clear: both;"></div>
                                </li>

                                <li class="right">
                                    <img src="images/rss.png" alt="rss" /> 
                                    <a href="#">RSS</a>
                                    <div style="clear: both;"></div>
                                </li>

                            </ul>

                        </div>
                        <!-- End .social_8 -->
                    </div>
                    <!-- End #hook_footer_section_1 -->

                </div><!-- End #wrapper_footer_section_1 -->
                <div id="wrapper_footer_section_1_foot"></div>

                <style>
                    #wrapper_footer_section_2 {
                        width: 940px;
                        margin: 0px auto;
                    }
                    #wrapper_footer_section_2 #hook_copyright {
                        height: 30px;
                    }

                    .html_10 {
                        position: absolute;
                        left:0px;
                        top: 0px;
                    }

                    .html_10 p {
                        font-family: Arial, sans-serif;
                        font-size: 11px;
                        color: #5d5d5e;
                    }
                </style>
                <div id="wrapper_footer_section_2">
                    <div id="hook_copyright" class="hook">
                        <div id="html_10" class="html_10">
                            <p>©2012 POWERED BY TIARA™. ALL RIGHT RESERVED.</p>
                        </div>

                    </div>
                </div><!-- End #wrapper_footer_section_2 -->
            </div><!-- End #wrapper_footer -->


        </div><!--END wrapper-->
    </body>
</html>